<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>东家帮-下单</title>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" id="viewport" name="viewport">
	<meta name="format-detection" content="telephone=no">
	<meta name="renderer" content="webkit">
	<meta http-equiv="Cache-Control" content="no-siteapp" />
	<link rel="alternate icon" type="image/png" href="amazeui/assets/i/favicon.png">
	<link rel="stylesheet" href="${base}/css/common.css"/>
	<link rel="stylesheet" href="${base}/css/index2.css"/>
	<base href="${base}/index/">
</head>
<body style="background: #f0f0f0;">
<div class="order">
	<form action="${base}/index/createOrder" id="loginform" name="loginform" method="post">
	<div class="data">
		<div class="line hide">
			<div class="half1 hide">
				<p>入住时间:</p>	
				<input type="datetime-local" class="time" name="checkintime" id="checkintime" value="${now}" style=""/>
			</div>
			
		</div>
		<div class="line">
			<div class="half1" >
				<p>服务开始时间:</p>	
				<input type="datetime-local" class="time" name="checkouttime"  id="checkouttime" value="${now}" style="" />
			</div>
		</div>
		<div class="line">
			<div class="half1" >
				<p>最迟完成时间:</p>	
				<input type="datetime-local" class="time" name="endtime"  id="endtime"  value="${now}" style="" />
			</div>
		</div>
	</div>
	<#if hsize == 0 >
	<div class="data">
		<div class="line">
			<p style="margin-bottom: 8px;">暂无审核通过的房源</p>
		</div>
	</div>
	</#if>
	<#if hsize gt 0 >
	<div class="data">
		<#list houseList as one>
		<div class="line">
			<input type="radio" name="house" value="${one.id}" five="${one.five}" eight="${one.eight}"  fid="${one.fid}"  price="${one.aprice}" /> <span title="面积:${one.area}㎡" style="margin-right: 20px;font-size: 16px;">${one.name}</span><span style="font-size: 13px;color: #c6c6c0;">${one.address}</span>
		</div>
		</#list>
	</div>
	</#if>
	<div class="data hide">
		<div class="line">
			<div class="label">租客姓名</div>
			<div class="text"><input name="rentername" id="rentername" value="${rentername}"  placeholder="请输入租客姓名"/></div>
		</div>
	</div>
	<div class="data hide">
		<div class="line">
			<div class="label">租客电话</div>
			<div class="text"><input name="rentermobile" id="rentermobile" value="${rentermobile}" placeholder="请输入租客电话" /></div>
		</div>
	</div>
	<div class="data" style="margin-top: 24px;">
		<div class="line">
			<div class="label">服务内容 </div>
			<div class="text"><div id="detail" style="float: right;margin-right: 18%;padding: 2px 28px;color: #fcd65e;border: 1px solid #fcd65e;border-radius: 5px;display: none;">详细 </div></div>
		</div>
	</div>

	<div class="data s">
		<div class="line">
			<p style="margin-bottom: 8px;">基础服务（50元起/次）</p>
			<div class="service">入住咨询,退房检查 <img src="${base}/images/option_right.png" width="14" height="14" /></div>
			<div class="service">日常清扫 <img src="${base}/images/option_right.png" width="14" height="14" /></div>
			<div class="service linen15">布草清洗（15元/套/次） <input type="radio" id="linen15" name="linen" value="布草清洗" style="float: right;margin-right: 11.5%;width: 16px;height: 16px;" /> </div>
			<div class="service linen5">布草在家清洗（5元/套/次） <input type="radio" id="linen5" name="linen" value="布草在家清洗" style="float: right;margin-right: 11.5%;width: 16px;height: 16px;"/> </div>
			<div class="service" style=" padding: 8px;">
				<div class="label">1.5米床用:</div>
				<div class="text"><input type="number" id="five" name="five" value="0" min="0" style="width: 30%;margin-right: 10%;text-align: right;" value="${five?if_exists}" />套</div>
			</div>
			<div class="service"  style=" padding: 8px;">
				<div class="label">1.8米床用:</div>
				<div class="text"><input type="number" id="eight" name="eight" value="0" min="0" style="width: 30%;margin-right: 10%;text-align: right;" value="${eight?if_exists}" />套</div>
			</div>
		</div>
	</div>
	
	<div class="data s" style="display:none;" >
		<div class="line">
			<p style="margin-bottom: 8px;">需要您提供</p>
			<div class="service">1、扫帚 2、拖布 3、清洁剂 4、需要更换的布草</div>
		</div>
	</div>
	<div class="data s hide">
		<div class="line">
			<p style="margin-bottom: 8px;">其他服务(如有需要，联系客户处理)</p>
			<div class="service">厨房深度保洁（50元/次）</div>
			<div class="service">全屋玻璃清洁（2元/平方米/次）</div>
			<div class="service">包日制服务</div>
			<div class="service">包月制服务</div>
		</div>
	</div>
	
	<div class="data hide">
		<div class="line">
			<div class="label">房东姓名</div>
			<div class="text"><input name="username" id="username" value="${username}" placeholder="请输入房东姓名" /></div>
		</div>
	</div>
	<div class="data hide">
		<div class="line">
			<div class="label">房东电话</div>
			<div class="text"><input name="usermobile" id="usermobile" value="${usermobile}" placeholder="请输入房东电话" /></div>
		</div>
	</div>
	<div class="data">
		<div class="line">
			<div class="label">备注</div>
			<div class="text"><input name="note" id="note" value="${note}" placeholder="开门密码,其他要求" /></div>
		</div>
	</div>
	<div class="data" style="margin-top: 24px;">
		<div class="line">
			<div class="half" >
				<span style="float: left;margin-top: 5px;font-size: 18px;" >结算:</span>
				<span id="total">0</span>元
			</div>
			<div class="half">
				<input type="hidden" value="" name="price"  id ="price"/>
				<input class="btn" type="button" value="去支付" id ="create"/>
			</div>
		</div>
	</div>
	</form>
	<div id="intr" style="display: none;">
		<#list configList as one>
		<div class="data">
			<div class="line">${one.title}</div>
		</div>
		</#list>
	</div>
</div>

</body>
<script type="text/javascript" src="${base}/js/common.js"></script>
<script src="${base}/js/jquery1.10.2.min.js" ></script>
<script src="${base}/js/jquery.form.js" ></script>
<script type="text/javascript">
$(document).ready(function() {
	function cal(){
		var total = 0;
		var house =$("input:radio[name='house']:checked");
		if (typeof(house.attr("price")) != "undefined"){ 
			total = total + Number(house.attr("price"));
		}
		var five = $("#five").val();
		var eight = $("#eight").val();
		var linen = $("input[name='linen']:checked").val();
		if(typeof(linen)=="undefined"){
			
		} else {
			var id = $("input[name='linen']:checked").attr("id").replace("linen","");
			total = total + (parseInt(five)+parseInt(eight))*id;
		}
		/*
		if($("#depth").is(':checked')){
			total = total + 50;
		}
		if($("#glass").is(':checked')){
			var house =$("input:radio[name='house']:checked");
			if (typeof(house.attr("price")) != "undefined"){ 
				total = total + Number(house.attr("price"));
			}
		}
		*/
		return total;
	}
	$("#detail").click(function (){
		//$("#intr").css("display","block")
	});
	$("#intr").click(function (){
		$("#intr").css("display","none")
	});
	$("input:radio[name='house']").click(function(){
		$("#five").val($(this).attr("five"));
		$("#five").attr("max",$(this).attr("five"));
		$("#eight").val($(this).attr("eight"));
		$("#eight").attr("max",$(this).attr("eight"));
		
		$("#total").html(cal());
		
		var fid = $(this).attr("fid");
		if (fid > 0){
			$("div.linen5").addClass("hide");
			$("div.linen15").removeClass("hide");
		} else {
			$("div.linen15").addClass("hide");
			$("div.linen5").removeClass("hide");
		}
	});
	$("#glass").click(function(){
		$("#total").html(cal());
	});
	$("#depth").click(function(){
		$("#total").html(cal());
	});
	$("input:radio[name='linen']").click(function(){
		$("#total").html(cal());
	});
	$("#five").change(function(){
		$("#total").html(cal());
	});
	$("#eight").change(function(){
		$("#total").html(cal());
	});
	$("#create").click(function (){
		$("#total").html(cal());
		$("#price").val(cal());
		var checkintime = $("#checkintime").val();
		if (checkintime){
		} else {
			alert("请选择入住时间!");
			$("#checkintime").focus();
			return;
		}
		
		var checkouttime = $("#checkouttime").val();
		if (checkouttime){
		} else {
			alert("请选择退房时间!");
			$("#checkouttime").focus();
			return;
		}
		
		var endtime = $("#endtime").val();
		if (endtime){
		} else {
			alert("请选择最迟退房时间!");
			$("#endtime").focus();
			return;
		}
		/*
		var rentername = $("#rentername").val();
		if (rentername){
		} else {
			alert("请输入租客信息!");
			$("#rentername").focus();
			return;
		}
		
		var usermobile = $("#usermobile").val();
		if (usermobile){
		} else {
			alert("请输入租客电话!");
			$("#usermobile").focus();
			return;
		}
		*/
		var house =$("input:radio[name='house']:checked");
		if (house){
			
		} else {
			alert("请选择房源信息!");
			return;
		}
		var fiveval = parseInt($("#five").val());
		var fivemax = parseInt($("#five").attr("max"));
		if (fiveval<0 || fiveval >fivemax) {
			alert("1.5米床用套输入有误!");
			$("#five").focus();
			return;
		}
		var eightval = parseInt($("#eight").val());
		var eightmax = parseInt($("#eight").attr("max"));
		if (eightval<0 || eightval >eightmax) {
			alert("1.8米床用套输入有误!");
			$("#eight").focus();
			return;
		} 
	    $("#loginform").submit();
	});
	
	
});
</script>
</html>